<template>
	<view class="index">
		<!-- f1  大卡片 -->
		<view class="sCard">
			<img src="../../static/img/u2406.png" alt="">
			<view class="title">
				<text class="title1">普吉岛</text>
				<text class="title2">普吉岛介绍详情</text>
			</view>
		</view>		
	</view>
</template>

<script>

	
</script>

<style scoped lang="scss">
	.index {

		.sCard {
			background-color: #fff;
			border-radius: 10px;
			width: 720rpx;
			height: 550rpx;
			margin-top: 15px;
			display: flex;
			flex-direction: column;
			padding-bottom: 15px;

			img {
				border-radius: 10px 10px 0 0;
				width: 100%;
				height: 70%;
			}

			.title {
				padding: 15px;
				display: flex;
				flex-direction: column;

				.title1 {
					font-size: 16px;
					color: #000;
					padding-bottom: 10px;
				}

				.title2 {
					font-size: 14px;
					color: #797979;
					// 文字限制为2行  超出部分为省略号
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					-webkit-box-orient: vertical;
				}
			}
		}
	}
</style>
